<template>
    <div class="wrapper" ref="wrapper">
        <div class="content">
            <slot></slot>
        </div>
    </div>
</template>
<script>
import BScroll from 'better-scroll'
export default {
    name:'Scroll',
    props:{
        probeType:{
            type:Number,
            default:0
        },
        pullUpLoad:{
            type:Boolean,
            default:false
        }
    },
    data() {
        return {
            scroll:null
        }
    },
    mounted() {
        this.scroll=new BScroll(this.$refs.wrapper,{
            click:true,
            probeType:this.probeType,
            pullUpLoad:this.pullUpLoad
        })
        // 监听滚动的位置
        this.scroll.on('scroll',(position)=>{
            this.$emit('scroll',position)
        })
        // 监听上拉加载更多
        if(this.pullUpLoad){
            this.scroll.on('pullingUp',()=>{
                this.$emit('pullingUp')
            })
        }
    },
    methods: {
        scrollTo(x,y,time=500){
            this.scroll&&this.scroll.scrollTo(x,y,time)
        },
        finishPullUp(){
            this.scroll&&this.scroll.finishPullUp()
        },
        refresh(){
            // console.log("sss")
            this.scroll&&this.scroll.refresh()
        },
        getScrollY(){
            return this.scroll?this.scroll.y:0
        }
    },

// 滚动的元素必须有content包裹，并且wrapper下面只能有一个元素

// 默认情况下BScroll是不可以实时的监听滚动位置
// probe 侦测
// 0,1都是不侦测实时的位置
// 2: 在手指滚动的过程中侦测, 手指离开后的惯性滚动过程中不侦测.
// 3: 只要是滚动, 都侦测.

// 默认只能发送一次加载更多的请求，所以在加载完之后bscroll.finishPullUp()就可以继续加载
}
</script>

